.cityPlan {
  background: #fff;
  width: 100%;
  height: 100%;
  margin: 0 auto;
  .service-banner {
    width: 100%;
    position: relative;
    img{
      width: 100%;
      height: 100%;
    }
  }
  .city {
    max-width: 980px;
    height: auto;
    margin: 0 auto 150px;
    h2{
      width: 100%;
      float: left;
      margin: 80px auto 30px;
      text-align: center;
      font-size: 30px;
      span{
        display: block;
        height: 2px;
        width: 160px;
        margin: 20px auto 0 auto;
        background: #b67233;
      }
    }
    .cityList {
      height: auto;
      .cityBox {
        float: left;
        width: 33.333333333%;
        height: 326px;
        position: relative;
        img {
            width: 100%;
            height: 100%;
            float: left;
        }
        h4{
          position: absolute;
          width: 88px;
          line-height: 88px;
          background-color: #fff;
          text-align: center;
          color: #333;
          font-size: 22px;
          left: 50%;
          top:50%;
          margin-left: -44px;
          margin-top: -44px;
          border-radius: 50%;
          opacity: .8;
        }
        .cityTop {
          height: 326px;
          width: 100%;
          position: absolute;
          background: #535353;
          padding: 0 15%;
          //display: none;
          transition: all .5s ease 0s;
          opacity: 0;
          h3 {
            width: 100%;
            text-align: center;
            font-size: 22px;
            color: #fff;
            margin-top: 20%;
            margin-bottom: 15px;
          }
          p {
            line-height: 30px;
            font-size: 14px;
            color: #fff;
            text-indent: 28px;
          }
        }
      }
      .cityBox:hover {
        .cityTop {
          //display: block;
          opacity: 1;
          background: rgba(83, 83, 83, 0.9);
        }
      }
      .lastCity {
        background: #eeeeee;
        .more-city {
          width: 98px;
          display: block;
          position: absolute;
          left: 50%;
          top: 48%;
          transform: translateX(-50%);
          font-size: 16px;
          border: 2px solid #b57332;
          color: #b57332;
          border-radius: 44px;
          font-family: 微软雅黑;
          text-align: center;
          line-height: 26px;
        }
      }
    }
  }
  .city-padding {
    float: left;
    width: 100%;
    height: 146px;
  }
}
